<template>
	<view>
		<view class="nav" :style="'background:url('+background+')'">技师</view>
		<view class="top" :style="'background:url('+background+')'" style="background-size: 100% 100%;">
			
		</view>
		<view class="bz p-2 content">
			<view class="list p-3 bz b-radius1 d-flex flex-nowrap j-sb a-center mb-2" v-for="(item,index) in newslist" :key="index">
				<view class="flex-1">
					<view class="name">{{item.name}}</view>
					<view class="d-flex flex-nowrap a-center pb-1">
						<view class="des">{{item.position}}</view>
						<view class="line mx-2"></view>
						<view class="des">从业{{item.workYear}}年</view>
					</view>
					<view class="d-flex flex-nowrap a-center pb-1">
						<view class="des">{{item.autograph}}</view>
					</view>
					<view class="d-flex a-center pb-1" style="width:500rpx;flex-wrap: wrap;">
						<view class="des">今日接单数：</view>
						<image src="../../static/yueliang@2x.png" v-for="(item,index) in item.count" :key="index" class="icon" mode="widthFix"></image>
					</view>
				</view>
				<view>
					<button class="cu-btn lg" @tap="goTo(item.id,item.name)">预约</button>
				</view>
			</view>
		</view>
	<!-- 	<view style="height: 80rpx;"></view> -->
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	var page=0;
	export default{ 
		components: {
			uniLoadMore
		},
		data(){
			return{
				background:'/static/bg@2x.png',
				newslist:[],
				status: 'more',
				contentText: {
					contentdown: '上拉加载更多',
					contentrefresh: '加载中...',
					contentnomore: '到底了...'
				},
				num:0,
				reload: false,
				money:0
			}
		},
		onLoad() {
			var that = this;
			// #ifdef  MP-WEIXIN
			let base64 = wx.getFileSystemManager().readFileSync(this.background, 'base64');
			that.background= 'data:image/jpg;base64,' + base64;
			// #endif
			this.getNewList()
		},
		onPullDownRefresh() {
			this.getNewList()
		},
		onReachBottom() {
			this.status = 'more';
			this.getList();
		},
		methods:{
			getNewList(){
				
				var _this=this;
				page=1;
				
				var arr= {
						curr:page,
						pageSize:10
					};
				arr=JSON.stringify(arr)
				
				this.$http({
					url: '/IWeiXinService.queryTechnicianList',
					method: 'post',
					data: arr
				}).then((res) => {
					console.log(res)
					uni.stopPullDownRefresh();
					if (res.code == '0') {
						_this.newslist=res.data;
						_this.num=res.count;
			
					}else if (res.code == '100004') {
						uni.showToast({
							title: res.msg,
							icon: "none"
						});
						// setTimeout(function() {
						// 	uni.navigateTo({
						// 		url: "/pages/login/login"
						// 	})
						// }, 1000)
					}
				}).catch((err) => {
					console.log(err)
				
				})
			},
			getList(){
				if(this.num<=10){
					this.status = '';
					return;
				}else{
					var ye=page*10;
					if(this.num<=ye){
						this.status = '';
						return;
					}
				}
				page++
				
				var _this=this;
				this.status = 'loading';
				this.$http({
					url: '/work/getMyBillList',
					method: 'post',
					data: {
						page:page,
						uid:uni.getStorageSync('uid')
					}
				}).then((res) => {
					console.log(res)
					if (res.status == 'ok') {
						_this.newslist=_this.newslist.concat(res.data.list);
						_this.num=res.data.total;
				
					}
				}).catch((err) => {
					console.log(err)
				
				})
			},
			goTo(id,name){
				uni.setStorageSync('selectedTechnicianId' , id);
				uni.setStorageSync('selectedTechnicianName' , name);
				uni.switchTab({
				    url: '../appointment/index'
				});
			}
		}
		
	}
</script>

<style lang="scss" scoped>
	page{
		background: #F6F7F8;
		height: 100%;
	}
	.top{
		
		height: 230rpx;
	}
	.nav{
		height: 68px;
		line-height: 94px;
		color: #fff;
		text-align: center;
		font-size:36rpx;
		font-family:PingFang;
		font-weight:500;
		color:rgba(255,255,255,1);
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		z-index: 8888888888;
	}
	.content{
		position: relative;
		top: -80rpx;
		left: 0;
		right: 0;
	}
	.list{
		background:rgba(255,255,255,1);
		box-shadow:0px 0px 20px 0px rgba(0, 0, 0, 0.1);
	}
	.name{
		height:60rpx;
		line-height: 60rpx;
		font-size:34rpx;
		font-family:PingFang;
		font-weight:500;
		color:rgba(47,47,47,1);
	}
	.des{
		font-size:26rpx;
		font-family:PingFang;
		font-weight:400;
		color:rgba(102,102,102,1);
	}
	.line{
		width:1rpx;
		height:20rpx;
		background:rgba(153,153,153,1);
	}
	.icon{
		width: 21rpx;
		height: 21rpx;
		display: block;
		margin-left: 10rpx;
	}
	.cu-btn{
		background:rgba(117,62,130,1);
		color: #fff;
		font-size:28rpx;
		font-family:PingFang;
		font-weight:500;
		width:140rpx;
		height:60rpx;
		line-height: 60rpx;
	}
</style>
